*,::before,
::after{
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    user-select: text;
    -webkit-user-select: text;
    -webkit-tap-highlight-color: transparent;
}
body {
  /*  font: 14px  PingFang SC,"Helvetica Neue",Helvetica,Arial,"Microsoft Yahei",
    "Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;*/
    font: 14px 'PingFangSC-Medium','\5FAE\8F6F\96C5\9ED1',Arial,'Hiragino Sans GB','\5B8B\4F53';
    color: #333333;
  text-decoration: none;
}
a{
  text-decoration: none;
}
.font-size12{
    font-size: 12px;
}
.font-size16{
  font-size: 16px;
}
.font-size18{
    font-size: 18px;
}
.font-size20{
    font-size: 20px;
}
.font-size24{
    font-size: 24px;
}
.font-size30{
    font-size: 30px;
}
.font-color-white{
    color: #ffffff;
}
.font-color-lightGray{
  color: #ccc;
}
.font-color-darkGray{
  color: #36404A;
}
.font-color-gray2{
  color: #9B9B9B;
}
.font-color-gray{
    color: #6E6E6E;
}
.font-color-gray3{
  color:#4A4A4A;
}
.font-color-blue{
    color: #1890ff;
}
.font-color-red{
  color: #ff503f;
}
.font-color-green{
  color: #1ecc7c;
}
.hover-color{
    color: #ff620c;
}
.content-blue-bg{
    background: #1890FF;
}
.content-lightBlue-bg{
    background: #f5faff;
}
.content-gray-bg{
    background-color: #ECEFF1;
}
.content-green-bg{
    background-color: #53d4d4;
}
.content-white-bg{
    background: #ffffff;
}
.item-hover-bg{
    background: #69C0FF;
}
.transition-element{
    transition: all 0.3s;
    -webkit-transition:all 0.3s;
}
.border-color{
    border: 1px solid #DCDCDC;
}
.f-left{
    float: left;
}
.f-right{
    float: right;
}
.clearfix::before,.clearfix::after{
    content: '';
    display: block;
    visibility: hidden;
    height: 0;
    line-height: 0;
    clear: both;
}
.text-center{
    text-align: center;
}
.zero-margin-center{
    margin: 0 auto;
}
.absolute-center{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
}
.display-block{
    display: block;
}
.display-none{
    display: none;
}
.img-full{
  width: 100%;
  height: 100%;
}
.border-bottom{
    border-bottom: 1px solid #DCDCDC;
}
//模块标题模板
.article-title {
  width: 100%;
  height: 36px;
  padding-top: 14px;
  .content-lightBlue-bg();
  h3 {
    .font-size18();
    display: block;
    padding-left: 10px;
    border-left: 4px solid #096dd9;
  }
}

/*内容文字显示省略处理*/
.content-font-less{
    word-break: break-all;
    text-overflow: ellipsis;
    display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
    -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
    -webkit-line-clamp: 2; /** 显示的行数 **/
    overflow: hidden;  /** 隐藏超出的内容 **/
}
/*内容文字省略一排显示*/
.content-font-one{
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.font-one-col{
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
/*图片masker*/
.img-masker{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    line-height: 0;
    text-indent: 0;
    .font-color-white();
    background: rgba(0,0,0,0.8);
    .transition-element();
    overflow: hidden;
}
/*底色间隔*/
.spacing{
   width: 100%;height: 10px;
    .content-gray-bg();
}
/*主体大容器*/
.container-layout{
    width: 100%;
    min-width: 1200px;
    padding: 1px 0;
}
/*主体小容器*/
.content-layout{
    width: 100%;
    min-width: 1170px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 1px 0;
}
.sub-page-section{
    .content-gray-bg();
    padding-bottom: 40px;
    .content-layout{
        margin-top: 10px;
    }
}
.content-left,.content-right{
    .f-left();
    background: #ffffff;
}
.content-left{
    width: 800px;
}
.content-right{
    margin-left: 24px;
    width: 356px;
}


/*swiper容器样式*/
.swiper-container {
    width: 100%;
    height: 100%;
}
//顶部导航栏
#public-header{
  position: relative;
  z-index: 1200;
  border: none;
  background-color: #fff;
  height: 96px;
  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.05);
  #header-nav{
    height: 96px;
    font-size: 22px;
    color: #FF6E6E6E;
    .logo-box{
      margin-top: 21px;
      float: left;
      .logo{
        float: left;
        display: inline-block;
        width: 130px;
        height: 54px;
        background-color: #D0D4DB;
        border-radius: 8px;
        margin-right: 30px;
      }
      .classify{
        height: 72px;
        position: relative;
        .font-color-gray();
        cursor: pointer;
        line-height: 54px;
        float: left;
        display: inline-block;
        margin-right: 32px;
        .classify-log{
          vertical-align: middle;
          display: inline-block;
          width: 22px;
          height: 22px;
          background-color: #D0D4DB;
        }
        .category-f{
          background-color: #fff;
          z-index: 9999;
          display: none;
          position: absolute;
          top: 72px;
          left: -135px;
          width: 351px;
          height: 408px;
          .cate-f{
            margin-top: 20px;
            .cate-detail{
              position: relative;
              float: left;
              width: 100%;
              height: 95px;
              &:hover{
                background-color: #F8F9FB;
                strong{
                  .font-color-blue();
                }
              }
              .cate-tag{
                padding-left: 16px;
                strong{
                  .font-size20();
                }
                .listModel{
                  .font-color-gray2();
                  margin-right: 4px;
                  .font-size16();
                  div{
                    margin-top: -10px;
                  }
                }
                .point-r{
                  position: absolute;
                  right: 10px;
                  top: 37px;
                  display: block;
                  width: 12px;
                  height: 20px;
                  background-color: #ccc;
                }
              }
              .list-item{
                background-color: #fff;
                display: none;
                .font-size16();
                box-shadow: 0 4px 6px 2px rgba(0,0,0,0.1);
                border-radius: 8px;
                position: absolute;
                left: 352px;
                top: 0;
                width: 679px;

                .itemleft{
                  margin-top: 20px;
                  margin-left: 20px;
                  width: 630px;
                  dl{
                    margin-bottom: 20px;
                    dt{
                      margin-bottom: 12px;
                    }
                    dd{
                      a{
                        display: inline-block;
                        padding: 0 10px;
                        line-height: 24px;
                      }
                    }
                  }
                }
              }
              .list-item.margin-top-95{
                top:-95px;
              }
              .list-item.margin-top-190{
                top:-190px;
              }
              .list-item.margin-top-285{
                top:-285px;
              }
            }
          }
        }
      }
      .identity{
        .font-color-gray();
        cursor: pointer;
        line-height: 54px;
        float: left;
        display: inline-block;

      }
      .help-center{
        margin-left: 40px;
        .font-color-gray();
        cursor: pointer;
        line-height: 54px;
        float: left;
        display: inline-block;
      }
    }
    .main-nav{
      line-height: 96px;
      float: left;
      display: block;
      margin: 0 125px;
      .nav-unit{
        text-decoration: none;
        color: #6E6E6E;
        margin:0 18px;
      }
    }
    .search-box{
      float: left;
      margin: 0 48px;
      display: none;
      .whole-search{
        margin-top: 27px;
        height: 40px;
        width: 460px;
        border: none;
        border-bottom: 2px solid #D0D4DB;
        .font-size18();
        line-height: 40px;
      }
      .whole-s-btn{
        vertical-align: middle;
        border: none;
        background-color: #ccc;
        display: inline-block;
        width: 24px;
        height: 24px;
      }
      .close-search{
        text-decoration: none;
        vertical-align: middle;
        font-size: 24px;
      }
    }
    .navbar-right{
      margin-right: 0;
      .navbar-right-item{
        height: 76px;
        display: inline-block;
        float: left;
        align-content: center;
        .fun{
          margin-top: 36px;
          height: 24px;
          .fun-item{
            width: 24px;
            height: 44px;
            margin-right: 20px;
            float: left;
            position: relative;
            &:hover{
              .personal-hint{
                display: block;
              }
            }
            .icon{
              display: inline-block;
              width: 24px;
              height: 24px;
              background-color: #9d9d9d;
            }
            .personal-hint{
              position: absolute;
              display: none;
              top: 44px;
              left: -36px;
              width: 100px;
              background-color: #fff;
              .fun-d-list{
                overflow: hidden;
                margin:10px 0;
                .fun-list{
                  width: 100%;
                  text-align: center;
                  a{
                    text-decoration: none;
                    line-height: 35px;
                    font-size: 15px;
                    color: #4A4A4A;
                    letter-spacing: 0;
                  }
                }
              }
            }
          }
          .user-msg{

          }
        }
      }
      .user-lr{
        display: block;
        line-height: 96px;

        a{
          .font-color-gray2();
          font-size: 22px;
          padding:0;
          line-height: 96px;
          display: inline-block;
          float: left;
          &:hover{
            background-color: #fff;
          }
        }
        span{
          padding: 0 6px;
          float: left;
          .font-color-gray2();
          vertical-align: middle;
        }
      }
      .has-login{
        display: block;
        position: relative;
        height: 96px;
        .user-header-top{
          padding: 0;
          margin-top: 24px;
          width: 48px;
          height: 48px;
          border-radius: 50%;
          display: block;
          overflow: hidden;
          img{
            width: 100%;
            height: 100%;
          }
        }
        .personal-fun{
          display: none;
          z-index: 9999;
          position: absolute;
          top:94px;
          right: -10px;
          width: 100px;
          height: 165px;
          background-color: #fff;
          ul{
            margin-top: 18px;
            .fun-list{
              line-height: 50px;
              height: 50px;
              width: 100%;
              text-align: center;
              font-size: 15px;
              color: #4A4A4A;
              letter-spacing: 0;
              &:nth-child(2){
                border-bottom: 1px solid #eee;
              }
              a{
                text-decoration: none;
              }
              &:hover{

              }
            }
          }
        }
      }
    }
  }
}

//登录对话框
.login-box{
  display:none;
  .full-shade{
    position:fixed;
    top:0;
    left:0;
    z-index:10003;
    width:100%;
    height:100%;
    background-color:#000;
    opacity:0.3;
    /*兼容IE8及以下版本浏览器*/
    filter: alpha(opacity=30);
    display:block;
  }
  .login-in{
    display: none;
    border-radius: 8px;
    width: 546px;
    height: 659px;
    position: fixed;
    z-index:10004;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    .layui-btn{
      text-decoration: none;
    }
    .content-white-bg();
    .login-style{
      overflow: hidden;
      display: none;
      position: relative;
      .login-title{
        font-weight:700;
        text-align: center;
        font-size: 30px;
        color: #36404A;
        letter-spacing: 15px;
        line-height: 24px;
        margin:40px 0 50px;

      }
      .idn-choose{
        margin-bottom: 38px;
        display: flex;
        justify-content: space-around;
        .i-chice{
          cursor: pointer;
          img{
            width: 154px;
            height: 154px;
            border-radius: 50%;
            margin-bottom: 30px;
            overflow: hidden;
          }
          .i-title{
            font-size: 18px;
            color: #9B9B9B;
            letter-spacing: 0;
            text-align: center;
            line-height: 18px;
            font-weight:700;
          }
        }
        .i-choose{
          .i-title{
            color: #2F5AFF;
          }
        }
      }
      .fun-center{
        width: 333px;
        margin: 0 auto 80px;
        .hint-res{
          font-size: 16px;
          color: #9B9B9B;
          letter-spacing: 0;
          line-height: 16px;
          margin-bottom: 10px;
        }
        .next-btn-f{
          width: 100%;
          height: 40px;
          line-height: 40px;
          background: #2F5AFF;
          box-shadow: 0 0 4px 0 rgba(47,90,255,0.50);
          border-radius: 8px;
          font-size: 16px;
          color: #FFFFFF;
          margin-bottom: 10px;
        }
        .fast-login{
          text-decoration: none;
          font-size: 16px;
          color: #2F5AFF;
          line-height: 16px;
          border-bottom: 1px solid #2F5AFF;
        }
      }
      .third-party{
        width: 333px;
        margin: 0 auto;
        .third-party-t{
          font-size: 14px;
          color: #9B9B9B;
          letter-spacing: 0;
          text-align: center;
          line-height: 16px;
          margin-bottom: 14px;
        }
        .tp-list{
          width: 200px;
          margin:0 auto;
          li{
            float: left;
            margin-right: 45px;
            text-align: center;
            &:nth-child(3){
              margin-right: 0;
            }
            .icon-t{
              display: block;
              width: 36px;
              height: 36px;
              background-color: #cccccc;
              border-radius: 50%;
              overflow: hidden;
              margin-bottom: 10px;
            }
          }
        }
      }
      .close-btn{
        position: absolute;
        right: 40px;
        top: 40px;
        display: block;
        width: 20px;
        height: 20px;
        background-color: #f4f4f4;
        font-style: normal;
      }
      .find-by-phone{
         margin:104px 0 32px 40px;
         font-size: 20px;
         color: #36404A;
         letter-spacing: 0;
         line-height: 20px;
       }
      .tel-form{
        width: 333px;
        margin: 0 auto;
        .hint-f{
          font-size: 16px;
          color: #9B9B9B;
          letter-spacing: 0;
          line-height: 16px;
          margin-bottom: 10px;
        }
        .border-box{
          margin-bottom: 11px;
          width: 333px;
          height: 55px;
          border: 1px solid #D0D4DB;
          border-radius: 8px;
          position: relative;
          overflow: hidden;
          .prefix{
            position: absolute;
            left: 0;
            line-height: 55px;
            font-size: 14px;
            color: #4A4A4A;
            letter-spacing: 0;
            margin-left: 15px;
          }
          .user-tel{
            border: none;
            height: 100%;
            width: 100%;
            padding-left:95px;
          }
        }
        .hint-p{
          font-size: 16px;
          color: #9B9B9B;
          letter-spacing: 0;
          line-height: 16px;
          margin-bottom: 80px;
        }
        .next-tel,.next-tel-s,.next-tel-t,.next-tel-f,.next-tel-fo,.next-tel-login,.next-tel-code{
          width: 100%;
          background: #2F5AFF;
          box-shadow: 0 0 4px 0 rgba(47,90,255,0.50);
          border-radius: 8px;
          font-size: 16px;
          color: #FFFFFF;
          letter-spacing: 0;
          text-align: center;
          line-height: 40px;
          height: 44px;
        }
      }
      .layui-icon-left{
        margin:40px 0 0 40px;
        float: left;
        font-size: 36px;
        color:#9B9B9B;
        border-radius: 8px;
      }
    }
    .by-phone{
      display: none;
      .acc-prev{
        width: 154px;
        height: 154px;
        display: block;
        margin:0 auto 60px;
        border-radius: 50%;
        overflow: hidden;
      }
    }
    .f-by-phone{
      display: none;
      .tel-form{
        .border-box{
          margin-bottom: 70px;
        }
      }
    }
    .re-password,.re-password-code-login{
      display:none;
      .hint-f{
        margin-bottom: 23px;
        .send-phone{
          font-size: 16px;
          color: blue;
          font-style: normal;
        }
      }
      .veri-list{
        margin-bottom: 40px;
        li{
          float: left;
          width: 62px;
          margin-right: 28px;
          border-bottom: 2px solid #D8D8D8;
          &:last-child{
            margin-right: 0;
          }
        }
      }
      .veri-p{
        overflow: hidden;
        border: none;
        letter-spacing: 83px;
        padding: 0 24px;
        width: 333px;
        height: 44px;
        line-height: 44px;
      }
      .send-vari{
        display: block;
        font-size: 16px;
        color: #2F5AFF;
        margin-bottom: 10px;
      }
    }
    .re-password-s{
      display: none;
      .hint-f{
        .send-phone{
          font-style: normal;
          color:blue;
        }
      }
      .new-p-b{
        overflow: hidden;
        border-radius: 8px;
        border: 1px solid #D0D4DB;
        width: 333px;
        height: 55px;
        position: relative;
        margin-bottom: 70px;
        .label-n{
          position: absolute;
          left: 15px;
          top: 0;
          line-height: 55px;
          font-size: 14px;
          color: #4A4A4A;
        }
        .new-password{
          width: 100%;
          border: none;
          height: 55px;
          line-height: 55px;
          font-size: 14px;
          padding-left: 95px;
        }
      }
    }
    .re-password-t,.re-password-login{
      display: none;
      .hint-f{
        .send-phone{
          font-style: normal;
          color:blue;
        }
      }
      .new-p-b{
        overflow: hidden;
        border-radius: 8px;
        border: 1px solid #D0D4DB;
        width: 333px;
        height: 55px;
        position: relative;
        margin-bottom: 70px;
        .label-n{
          position: absolute;
          left: 15px;
          top: 0;
          line-height: 55px;
          font-size: 14px;
          color: #4A4A4A;
        }
        .new-password{
          width: 100%;
          border: none;
          height: 55px;
          line-height: 55px;
          font-size: 14px;
          padding-left: 95px;
        }
      }
      .new-p-b{
        margin-bottom: 10px;
      }
      .m-b-44{
        margin-bottom: 44px!important;
      }

      .agreement{
        display: inline-block;
        color:blue;
      }
    }
    .set-success{
      display: block;
      text-align: center;
      .success-logo{
        width: 82px;
        height: 82px;
        display: block;
        margin: 104px auto 30px;
      }
      .set-success-t{
        font-size: 20px;
        color: #4A4A4A;
        letter-spacing: 0;
        line-height: 20px;
        margin-bottom: 15px;
      }
      .set-success-con{
        font-size: 16px;
        color: #9B9B9B;
        letter-spacing: 0;
        text-align: center;
        line-height: 16px;
        margin-bottom: 39px;
      }
      .enter{
        text-decoration: none;
        display: block;
        margin:0 auto;
        width: 333px;
        height: 40px;
        text-align: center;
        .font-color-white();
        .font-size16();
        background: #2F5AFF;
        box-shadow: 0 0 4px 0 rgba(47,90,255,0.50);
        border-radius: 8px;
      }
    }
  }
  .set-perfer{
    display: none;
    border-radius: 8px;
    width: 758px;
    height: 692px;
    position: fixed;
    z-index:10004;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    .content-white-bg();
    padding: 60px;
    .set-perfer-t{
      font-size: 28px;
      color: #4A4A4A;
      margin-bottom: 60px;
    }
    .perfer-cate{
      overflow: hidden;
      float: left;
      width: 279px;
      margin-right: 80px;
      height: 162px;
      margin-bottom: 60px;
      &:nth-child(2n-1){
        margin-right: 0;
      }
      .p-cate-title{
        font-size: 22px;
        margin-bottom: 20px;
      }
      .perfer-list{
        .perfer-item{
          cursor: pointer;
          border: 1px solid #000;
          padding:8px 10px;
          border-radius: 8px;
          float: left;
          margin: 0 15px 15px 0;
          font-size: 14px;
        }
      }
    }
    .save-perfer{
      clear: both;
      background: #2F5AFF;
      box-shadow: 0 0 4px 0 rgba(47,90,255,0.50);
      border-radius: 8px;
      width: 333px;
      height: 40px;
      display: block;
      margin: 0 auto;
      color: #ffffff;
      text-decoration: none;
      .font-size16();
    }
    .blu{
      color: #94A5FA;
      .perfer-list{
        .perfer-item{
          border: 1px solid #94A5FA;
          color:#94A5FA;
        }
        .active{
          color: #ffffff;
          background-color: #94A5FA;
        }
      }
    }
    .yel{
      color: #FFBD69;
      .perfer-list{
        .perfer-item{
          border: 1px solid #FFBD69;
          color:#FFBD69;
        }
        .active{
          color: #ffffff;
          background-color: #FFBD69;
        }
      }
    }
    .gre{
      color: #62DDA6;
      .perfer-list{
        .perfer-item{
          border: 1px solid #62DDA6;
          color:#62DDA6;
        }
        .active{
          color: #ffffff;
          background-color: #62DDA6;
        }
      }
    }
    .red{
      color:  #FF978F;
      .perfer-list{
        .perfer-item{
          border: 1px solid  #FF978F;
          color: #FF978F;
        }
        .active{
          color: #ffffff;
          background-color:  #FF978F;
        }
      }
    }
  }

  //.register-in{
  //  transition: all 0.8s ease-in;
  //  opacity: 1;
  //  .login-title-style{
  //    .font-color-darkGray();
  //    font-size: 18px;
  //    em{
  //      line-height: normal;
  //    }
  //    .login-return{
  //      position: absolute;
  //      left: 30px;
  //      top: 30px;
  //      font-size: 32px;
  //      color: #ccc;
  //    }
  //  }
  //  .layui-tab-content
  //  .layui-tab-item{
  //    display: block;
  //    .input-cbx{
  //      .protocol{
  //        float: none;
  //        display: inline-block;
  //      }
  //    }
  //    .login-tpt{
  //      margin-top: 0px!important;
  //    }
  //  }
  //}
}